<template>
  <div>
    <div class="tl-form-line-title" v-if="showtitle">
      招待宿舍申请单
    </div>
    <div style="padding-left:15px;">
      <el-row>
        <el-col :span="24">
          <el-button type="primary" @click="openAddDialog" v-if="!disableEditSubmit">发起招待宿舍申请</el-button>
        </el-col>
      </el-row>
      <el-row style="margin-top:15px;" class="oa-tag">
        <el-col :span="24">
          <el-tag type="success" size="larger" v-for="(item, index) in datas" :key="index" @click="openEditDialog(item.relationsourceid)">{{ item.title }}{{ index + 1 }}（状态：{{ item.dispstate }}）[点击查看]</el-tag>
        </el-col>
        <el-col :span="24" v-if="datas.length === 0" style="color:#777;padding-bottom:5px;font-size:13px;">
          暂无数据
        </el-col>
      </el-row>
    </div>
    <apply ref="apply" @refresh="doRefresh" :sourceType="sourceType" :sourceId="id" :relationSourceType="relationSourceType"></apply>
  </div>
</template>

<script>
import apply from './apply'
export default {
  components: { apply },
  data() {
    return {
      id: 0,
      url: {
        queryList: '/base/systemRelation/queryList'
      },
      approvalNodeModel: {},
      datas: [],
      sourceType: 'McrCallHighApply',
      relationSourceType: 'ToaDormitoryApply',
      disableEditSubmit: false
    }
  },
  methods: {
    open() {
      this.sourceType = this.approvalNodeModel.sourcetype
      this.loadData()
    },
    loadData() {
      this.$tap.http.getAction(this.url.queryList, { qry_sourcetype: this.sourceType, qry_sourceid: this.id, qry_relationsourcetype: this.relationSourceType, qry_relationsystem: 'Toa' }).then((res) => {
        if (res.success) {
          this.datas = res.result
        } else {
          this.$tap.alert(res.message)
        }
      })
    },
    openAddDialog() {
      if (this.beforeAddMethod && !this.id) {
        new Promise(this.beforeAddMethod).then((result) => {
          if (result.success) {
            this.$refs.apply.id = 0
            this.$refs.apply.isAdd = true
            this.$refs.apply.visible = true
          } else {
            this.$tap.alert(result.message)
          }
        }).catch(() => {
          this.$tap.alert("主表添加失败！")
        })
      } else {
        this.$refs.apply.id = 0
        this.$refs.apply.isAdd = true
        this.$refs.apply.visible = true
      }
    },
    asynSave(resolve, reject) {
      if (this.datas.length === 0) {
        resolve({ success: true })
        return
      }
      for (let item in this.datas) {
        if (item.state === '0' || item.state === '2') {
          reject('有关联的招待宿舍申请单据未提交审批，不能进入下一步！请先提交审批')
          return
        }
      }
      resolve({ success: true })
    },
    openEditDialog(id) {
      this.$refs.apply.id = id
      this.$refs.apply.isAdd = false
      this.$refs.apply.visible = true
    },
    doRefresh() {
      this.loadData()
    }
  },
  props: {
    showtitle: {
      default: true,
      type: Boolean
    },
    beforeAddMethod: {
      type: Function,
      required: false
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.$emit('mounted')
    })
  }
}
</script>

<style>
.oa-tag .el-tag {
  cursor: pointer;
  margin-right: 10px;
}
</style>
